<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<head>
    <title></title>
    <%@ include file="../inc.jsp"%>
    <base href="<%=basePath%>">
        <script type="text/javascript">
		/**
		 *grid全选或全不选函数
		 *@param checkbox 调用对象
		 *@param gridId 要操作的grid的ID
		 */
        function allOrNone(checkbox,gridId){
        	var itemArr=$('#'+gridId+'>tr');
        	if(checkbox.checked){
        		for(var i=1;i<itemArr.length;i++){
	        		$($('#'+gridId+'>tr').get(i).childNodes[0].childNodes[0]).attr('checked',true);
        		}
        	}else{
        		for(var i=1;i<itemArr.length;i++){
	        		$($('#'+gridId+'>tr').get(i).childNodes[0].childNodes[0]).removeAttr('checked');
        		}
        	}
        }
        $(function () {
	         var options = {
			    url:'userController/dataGrid',
			    type:'post',
			    clearForm:true,
			    dataType:'json',
			    success: function(result) {
			    	var orginGridId='tabBody';
					var gridId='#'+orginGridId;
					if(gridId=='#') return;
					$('#pageNum').val(result.pageNum);
					$('#pageSize').val(result.pageSize);
					$(gridId).empty();
					var halfSize=5;
					var startPage=1;
					var endPage=result.pageTotal;
					if(result.pageNum-halfSize>startPage) startPage=result.pageNum-halfSize;
					if(result.pageNum+halfSize<endPage) endPage=result.pageNum+halfSize;
					//拼接
					$(gridId).append($('<tr>').append(''+
				          '<th width="40" ><input type="checkbox" onclick="allOrNone(this,\''+orginGridId+'\')"/>&nbsp;全选</th>'+
				          '<th>编号 </th>'+
				          '<th>账号</th>'+
				          '<th>姓名</th>'));
					$.each(result.list,function(i,data){
						var tr=$('<tr>');
						tr.append('<td><input type="checkbox" name="itemNo" value="'+data.id+'" />&nbsp;&nbsp;'+(i+1)+'</td>')
						if(i%2==0){
							tr.addClass('even');
						}
						tr.append('<td>'+data.id+'</td>');
						tr.append('<td>'+data.name+'</td>');
						tr.append('<td>'+data.realName+'</td>');
						$(gridId).append(tr);
					});
					$("#list").Chuchur().tableUi();//重新渲染table
					//插入
					var pagerStart='当前第'+(result.pageNum>result.pageTotal?0:result.pageNum)+'页/共'+result.pageTotal+'页&nbsp;&nbsp;共'+result.totalCount+'条记录&nbsp;&nbsp;';
					var pagerEnd='';
					if(result.pageNum>1){
						pagerEnd+='<a href="javascript:void(0);" onclick="formSubmit(1)">首页</a>&nbsp;<a href="javascript:void(0);" onclick="formSubmit('+(result.pageNum-1)+')">上一页</a>&nbsp; '
					}
					//'<a class="current">1</a>&nbsp;<a>2</a>&nbsp;<a>3</a>&nbsp;<a>4</a>&nbsp; <a class="badge badge-warning">5</a>&nbsp;<a class="navpage">...</a>&nbsp;<a>55</a>&nbsp;'
					for(var i=startPage;i<=endPage;i++){
						if(i==result.pageNum){
							pagerEnd+='<a class="current" href="javascript:void(0);" onclick="formSubmit('+i+')">'+i+'</a>&nbsp;';
						}else{
							pagerEnd+='<a href="javascript:void(0);" onclick="formSubmit('+i+')">'+i+'</a>&nbsp;';
						}
					}
					if(result.pageNum<result.pageTotal){
						pagerEnd+='<a href="javascript:void(0);" onclick="formSubmit('+(result.pageNum+1)+')">下一页</a>&nbsp;<a href="javascript:void(0);" onclick="formSubmit('+result.pageTotal+')">尾页</a>';
					}
						    	
					$("#dockedItems").html(pagerStart+pagerEnd);
			    }
			};
            $(".datepicker").datepicker();

            $('#list').hide();
            $('#find').click(function () {
				$('form').submit();
                $('#list').show();
            });
			$('.btnedit').click(function(){
				$.acc('Maintain-edit.html');
				alert('');
			});
			$('#userForm').on('submit',function(){
            	$(this).ajaxSubmit(options);
            	return false;
            });
		});
		function formSubmit(pageNum){
			if(pageNum<1) pageNum=1;
			$('#pageNum').val(pageNum);
			$('#userForm').submit();
		}
		</script>
</head>
<body>
    <div></div>
    <div class="alert alert-info">当前位置<b class="tip"></b>系统管理<b class="tip"></b>用户管理</div>
    <table class="tbform">
        <thead>
            <tr>
                <td colspan="6" class="auto-style2">&nbsp;请填写查询条件 </td>
            </tr>
        </thead>
        <tbody>
	    <form id='userForm'>
	        <input type="hidden" id="pageNum" name='pageNum' value="0"  class="ipt"/></td>
            <input type="hidden" id="pageSize" name='pageSize' value="20"  class="ipt"/></td>
            <tr>
                <td class="tdl">姓名</td>
                <td class="detail">
                    <input name='name' class="ipt" />
                </td>
                <td class="tdl">条件二</td>
                <td class="td_detail">
                    <input class="ipt"/></td>
                <td class="tdl">条件三</td>
                <td>
                    <input class="ipt"/></td>
                </td>
            </tr>
            <tr>
                <td class="tdl">提交日期起 </td>
                <td>
                    <div class="input-append">
                        <input class="ipt datepicker" size="16" type="text" id="startime" /><span class="add-on"><i class="icon-calendar"></i></span>至<input id="endtime" class="ipt datepicker" size="16" type="text" /><span class="add-on"><i class="icon-calendar"></i></span>
                    </div>
                </td>
                <td class="tdl">报销人 </td>
                <td>
                    <select size="1" name="select2" id="baoxiaoren">
                        <option value="10401"></option>
                        <option value="10388">第二营销事业部</option>
                        <option
                            value="10389">第三营销事业部</option>
                        <option
                            value="10390">第一营销事业部</option> 
                        <option
                            value="11159">IT中心</option>
                        <option
                            value="11160">ZTE全球售后服务中心</option>
                    </select></td>
                <td class="tdl">所属项目</td>
                <td>
                    <select id="xiangmu" size="1" name="select3">
                        <option value="10401"></option>
                        <option value="10388">第二营销事业部</option>
                        <option
                            value="10389">第三营销事业部</option>
                        <option
                            value="10390">第一营销事业部</option> 
                        <option
                            value="11159">IT中心</option>
                        <option
                            value="11160">ZTE全球售后服务中心</option>
                    </select></td>
            </tr>
            <tr>
                <td colspan="6" align="right">
                    <input class="btn" id="find" type="button" value="查询" />
                    <input class="btn" id="clear" type="reset" value="清空" /></td>
            </tr>
			</form>
        </tbody>
    </table>
    <table class="tb" id="list">
      <tbody id='tabBody'>
      </tbody>
      <tr class="pager">
        <th colspan="100" id="dockedItems"></th>
      </tr>
    </table>
</body>

